<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>无标题文档</title>
<link href="${pageContext.request.contextPath}/css/baStyle.css"
	rel="stylesheet" type="text/css" />
<script type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery-1.11.0.min.js"></script>
<style type="text/css">


.searchBtn button,.searchTxt .searchMenu .searchSelected{background-image:url(../images/png/searchbg.png);background-repeat:no-repeat;}

.searchTxt{float:left;width:399px;height:30px;border:2px solid #d3d3d3;border-right:0;position:relative;z-index:20;background:#fff;}
.searchTxt .radius{width:1px;height:1px;overflow:hidden;background:#f4f4f4;position:absolute;top:-2px;left:-2px;}
.searchTxtHover{float:left;width:399px;height:30px;border:2px solid #3297d8;border-right:0;position:relative;z-index:20;background:#fff;}
.searchTxtHover .radius{width:1px;height:1px;overflow:hidden;background:#cce5f5;position:absolute;top:-2px;left:-2px;}

.searchTxt .searchMenu{float:left;}
.searchTxt .searchMenu .searchSelected{color:#a8a8a8;cursor:pointer;font-weight:bold;height:30px;line-height:30px;padding:0 5px;width:48px;background-position:0px -54px;}
.searchTxt .searchMenu .searchOpen{background-position:0px -104px;}

.searchTxt .searchMenu .searchTab{display:none; position:absolute;top:30px;left:-2px;width:58px;border:2px solid #3297d8;border-top:0;background:#fff;z-index:20;}
.searchTxt .searchMenu .searchTab li{width:58px;height:28px;line-height:28px;color:#a8a8a8;font-size:14px;font-weight:bold;text-indent:10px;cursor:pointer;background:0px;margin-left:0px;padding:0px;border:0px}
.searchTxt .searchMenu .searchTab li.selected{background:#edf3fc;color:#6994c1;}

.searchTxt input{float:left;border:0;background:#fff;color:#333;font:14px/22px '宋体',verdana,tahoma,arial,'SimSun',sans-serif;width:221px;height:22px;margin:0;outline:medium none;padding:4px;}

.searchBtn{float:left;}
.searchBtn button{background-position:0px 0px;border:0;color:#fff;cursor:pointer;float:left;font-size:16px;height:34px;text-indent:-9999px;width:86px;}
/* #searchBtn:hover{ background:#045270;} */


</style>
<script type="text/javascript">
//获取工程名称
/* var pathName=window.document.location.pathname;
   var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1); */
$(document).ready(function(){
  /*复选框全选和全不选js*/
  $("#checkeds").click(function(){
      //!$(this).attr("checked")判断复选框的状态：如果选中则取反
   /*   $("#showTable :checkbox").each(function () {
        $(this).attr("checked",!$(this).attr("checked")); 
        }); */
      //下面的是用js的方式实现效果也是一样的 
        for(var i=0;i<$("#showTable :checkbox").length;i++){
         $("#showTable :checkbox")[i].checked=!$("#showTable :checkbox")[i].checked;
         }
  });
  
//给翻页指定页数样式
  $(".paginList a").each(function () {
     if("javascript:;"==$(this).attr("href")){
    	 $(this).parent("li").addClass("current");
     }
  });
  
  
  
  
 //搜索框的操作 
  $("#searchSelected").click(function(){ 
		$("#searchTab").show();
		$(this).addClass("searchOpen");
	}); 

	$("#searchTab li").hover(function(){
		$(this).addClass("selected");
	},function(){
		$(this).removeClass("selected");
	});
	 
	$("#searchTab li").click(function(){
		$("#searchSelected").html($(this).html());
		$("#searchTab").hide();
		$("#searchSelected").removeClass("searchOpen");
	});
  //给搜索框回显
	var _searchcolour ="${retColour}";
	if (null!=_searchcolour||""!=_searchcolour) {
		var colour=("1"==_searchcolour)?"彩色图":"黑白图";
		$("#searchSelected").html(colour);
	}
	 //给搜索框颜色回显
	var _searchcolour ="${retColour}";
	if (null!=_searchcolour && ""!=_searchcolour) {
		var colour=("1"==_searchcolour)?"彩色图":"黑白图";
		$("#searchSelected").html(colour);
	}else{
		$("#searchSelected").html("全部图");
	}
	 //给搜索框回显
	var _searchVal ="${queryValue}";
	if (null!=_searchVal && ""!=_searchVal) {
		$('#searchValue').val(_searchVal);//给搜索框赋值
	}else{
		$('#searchValue').val("请输入搜索关键字");//给搜索框赋值
	}
	
});

//批量删除
function delectAll(rownum,colour){
	var sum="";
	var col=0;
	var black=0;
	for(var i=0;i<$("#showTable :checkbox").length;i++){
		if($("#showTable :checkbox")[i].checked){
			var checkVal=$("#showTable :checkbox")[i].value;
			var ids=checkVal.split("_");
			if("1"==ids[1]){
				col=col+1;
			}
			if("0"==ids[1]){
				black=black+1;
			}
			if(""==sum){
				sum+=ids[0];
			}else{
				sum+=","+ids[0];
			}
			
		}
     }
	if(""!=sum){
	 var r=confirm("确定删除！");
	   if (r==true){
				$.ajax({
					type:"post", //提交的类型
					url:"${pageContext.request.contextPath}/baUser/delectAll.do",//提交地址
					data: {
					    "uuid":sum,
					   },
					dataType: 'text',
					success: function(data){ //回调方法
						if('succeed'==data){
							alert("删除成功！");
							location='${pageContext.request.contextPath}/baSkip/thumPic.do?currentPageNumber='+rownum+'&colour='+colour+'&queryValue=${queryValue}';
							if(col!=0 && black!=0){
								refresh("1");
								refresh("0");
							}else if(col!=0 && black==0){
								refresh("1");
							}else if(black!=0 && col==0){
								refresh("0");
							}
							
						}else{
							alert("删除失败！");
						}
					}
					});
	       }
	}else{
		alert("请选择至少一条要删除的数据！");
	}
}
//页面右上角选择图片类型
var hasAppendPageObj = false;
function thumpicQuery(){
	var pars=$('#type').val();
	var searchFormObj = $("#thumpicForm");
	if(!hasAppendPageObj){
		searchFormObj.append(getHiddenObj("colour","colour",pars));
		hasAppendPageObj = true;
	}	
	searchFormObj.submit();
}
function getHiddenObj(objId,objName,objValue){
	return jQuery("<input type=\"hidden\" id=\""+objId+"\" name=\""+objName+"\" value=\""+objValue+"\" />");
}



//搜索数据
var opinionObj = false;
function searchQuery(){
	var colour=$('#searchSelected').html();
	var inputval=$('#searchValue').val();
	if("彩色图"==colour){
		colour="1";	
	}else if("黑白图"==colour){
		colour="0";	
	}else{
		colour="";	
	}
	if("请输入搜索关键字"!=inputval){
		var searchFormObj = $("#searchPicForm");
		if(!opinionObj){
			searchFormObj.append(getHiddenObj("colour","colour",colour));
			searchFormObj.append(getHiddenObj("queryValue","queryValue",inputval));
			opinionObj = true;
		}	
		searchFormObj.submit();	
	}else{
		alert("请输入要查询的数据！");
	}
	 
}

//删除单条信息
function delectAlone(id,picname,bencolo,rownum,colour){
	var r=confirm("确定该条数据！");
	if (r==true){
		$.ajax({
			type:"post", //提交的类型
			url:"${pageContext.request.contextPath}/baUser/delectAlone.do",//提交地址
			data: {
			    "uuid":id,
			    "picname":picname,
			    "colour":bencolo
			   },
			dataType: 'text',
			success: function(data){ //回调方法
				 var ids =data.split("_");
			if('1'==ids[0]&&'ok'==ids[1]){
				alert("删除成功！");
				location='${pageContext.request.contextPath}/baSkip/thumPic.do?currentPageNumber='+rownum+'&colour='+colour+'&queryValue=${queryValue}';
				refresh(bencolo);
			}else if('1'==ids[0]&&'ok'!=ids[1]){
				alert("数据库已删除，图片未收藏成功！");
			}else if('ok'==ids[1]&&'1'!=ids[0]){
				alert("图片删除成功，数据未删除成功！");
			}else{
				alert("删除失败！");
			}
			
			
			}
			});
	  }	
}
function refresh(colour){
	$.ajax({
		type:"post", //提交的类型
		url:"${pageContext.request.contextPath}/baUser/returnRefresh.do",//提交地址
		data: {
		    "colour":colour,
		   },
		dataType: 'text',
		success: function(data){ //回调方法
			if('succeed'==data){
				alert("删除成功！");
			}else{
				alert("删除失败！");
			}
		}
		});
}

/*刷新页面*/
function refreshData(uprownum,upcolour,colour){
	location='${pageContext.request.contextPath}/baSkip/thumPic.do?currentPageNumber='+'1'+'&colour='+upcolour+'&queryValue=${queryValue}';
	if("all"==colour){
		refresh("1");
		refresh("0");
	}else{
		refresh(colour);
	}
}

//清空数据
function clearData(cType){
	var colour="";
	if("1"==cType){
		colour="彩色";
	}else if("0"==cType){
		colour="黑白";
	}else{
		colour="全部";
	}
	var r=confirm("请慎用该操作,确定要清空["+colour+"]类型的图片！");
	if (r==true){
		$.ajax({
			type:"post", //提交的类型
			url:"${pageContext.request.contextPath}/baSkip/clearData.do",//提交地址
			data: {
			    "colour":cType
			   },
			dataType: 'text',
			success: function(data){ //回调方法
				if('0'!=data){
					alert("操作成功！");
					location='${pageContext.request.contextPath}/baSkip/thumPic.do';
				}else{
					alert("删除失败！");
				}
			}
			});
	  }	
}

</script>
</head>
<body>
<!--图片类型选择  -->
<form id="thumpicForm" action="${pageContext.request.contextPath}/baSkip/thumPic.do" method="post"></form>
<!--搜索  -->
<form id="searchPicForm" action="${pageContext.request.contextPath}/baSkip/thumPic.do" method="post"></form>
	<div class="place">
		<span>位置：</span>
		<ul class="placeul">
			<li><a href="#">首页</a></li>
			<li><a href="#">略视图信息</a></li>
		</ul>
	</div>
	<div class="rightinfo">
		<div class="tools">
			<ul class="toolbar">
				<li onclick="window.top.addDate();"><span><img
						src="${pageContext.request.contextPath}/images/baImages/t01.png" /></span>新增信息</li>
				<li onclick="delectAll('${currentPage}','${colourType}');"><span><img
						src="${pageContext.request.contextPath}/images/baImages/t03.png" /></span>批量删除</li>
						
			   <li onclick="clearData('${colourType}');"><span><img
						src="${pageContext.request.contextPath}/images/baImages/t03.png" /></span>清空数据</li>
				<%-- <li class="click"><span><img src="${pageContext.request.contextPath}/images/baImages/t02.png" /></span>选择</li> --%>
			</ul>
			<ul class="toolbar1">
			   <li class="selectList" style="background:0px;border:0px">
					<%-- <form method="post" class="search" action="${pageContext.request.contextPath}/baSkip/searchPic.do"> --%>
						<div id="searchTxt" class="searchTxt"
							onMouseOver="this.className='searchTxt searchTxtHover';"
							onMouseOut="this.className='searchTxt';">
							<div class="radius" style="top: -2px;"></div>
							<div class="radius" style="top: 31px;"></div>
							<div class="searchMenu">
								<div class="searchSelected" id="searchSelected">全部图</div>
								<div style="display: none;" class="searchTab" id="searchTab">
									<div class="radius" style="top: 259px;"></div>
									<div class="radius" style="top: 259px; left: 59px;"></div>
									<ul>
										<li>全部图</li>
										<li>彩色图</li>
										<li>黑白图</li>
									</ul>
								</div>
							</div>
							<input name="w" type="text" id="searchValue"
								onkeydown="javascript:if(event.keyCode==13) search('key');"
								onblur="if (this.value==''){this.value=this.defaultValue;this.style.color='#999'}"
								onfocus="if (this.value==this.defaultValue){this.value='';this.style.color='#333'}"
								value="请输入搜索关键字"/>
						</div>
						<div class="searchBtn">
							<button id="searchBtn" type="submit" onclick="searchQuery();">搜索</button>
						</div>
					<!-- </form> -->
                 </li>
			
				<li class="selectList" >
					<span>选择查看类型
					<select name="type"id="type"
							style="width: 90px; border:1px solid #3994c7; text-indent: 0; background: #f2f2f2;position: relative; bottom: -1px;">
								<option class="selects" value="" selected="selected">全部图纸</option>
								<option class="selects" value="1">彩色图</option>
								<option class="selects" value="0">黑白图</option>
						</select>
					</span> 
					<span>
					<button class="thumpic" type="button" onclick="thumpicQuery();">查询
					</button>
					</span>
				</li>
			</ul>
		</div>
		<!--回显搜索条件是彩色/黑白/全部 -->
				<script>
					var _colourType ="${colourType}";
					if (_colourType == "1") {
						$("#type :eq(1)").attr("selected","selected");
					}else if(_colourType == "0"){
						$("#type :eq(2)").attr("selected","selected");
					}else{
						$("#type :eq(0)").attr("selected","selected");
					}
				</script>
		<table class="tablelist">
			<thead>
				<tr>
					<th><input id="checkeds" name="" type="checkbox" value="" /></th>
					<th>名称<i class="sort"><img
							src="${pageContext.request.contextPath}/images/baImages/px.gif" /></i></th>
					<th>中文名称</th>
					<th>颜色</th>
					<th>是否为推荐</th>
					<th>排序</th>
					<th>审核状态</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody id="showTable">

				<c:forEach items="${datas}" var="brand" begin="0" end="149">
					<tr>
						<td style="display: none;"><input name="" type="hidden"
							value="${brand.id}" /></td>
						<td><input name="checkbox" type="checkbox" value="${brand.id}_${brand.colour}" /></td>
						<td>${brand.picname}</td>
						<td>${brand.desctibe}</td>
						<c:if test="${brand.colour=='1'}">
							<td>彩图</td>
						</c:if>
						<c:if test="${brand.colour=='0'}">
							<td>黑白</td>
						</c:if>
						<c:if test="${brand.isRecommend=='1'}">
							<td><font style="color: red">是</font></td>
						</c:if>
						<c:if test="${brand.isRecommend=='0'}">
							<td>否</td>
						</c:if>

						<td>${brand.featureSort}</td>
						<td>已审核</td>
						<td><a href="#" class="tablelink" onclick="window.top.updateDate('${brand.id}','${brand.picname}_${brand.desctibe}_${brand.colour}_${brand.isRecommend}_${brand.featureSort}_${brand.urladdress}','${currentPage}','${colourType}','${PicUrl}')">编辑</a> 
						    <a href="#" class="tablelink" onclick="delectAlone('${brand.id}','${brand.picname}','${brand.colour}','${currentPage}','${colourType}')">删除</a>
						</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
		<div class="pagin">
			<div class="message">
				共<i class="blue">${rowCount}</i>条记录，总页数<i class="blue">${pageCount}</i>，当前显示第&nbsp;<i
					class="blue">${currentPage}&nbsp;</i>页
			</div>
			<ul class="paginList">
				<li class="paginItem"><a
					href="<c:url value='/baSkip/thumPic.do?currentPageNumber=1&colour=${colourType}&queryValue=${queryValue}'/>">首页</a></li>
				<li class="paginItem"><c:if test="${currentPage!=1}">
						<a
							href="<c:url value='/baSkip/thumPic.do?currentPageNumber=${currentPage-1}&colour=${colourType}&queryValue=${queryValue}'/>">
							<span class="pagepre"></span>
						</a>
					</c:if></li>
				<c:forEach begin="${showStart}" end="${showEnd}" var="page">
					<c:if test="${currentPage==page}" var="boo">
						<li class="paginItem"><a href="javascript:;">${page}</a></li>
					</c:if>
					<c:if test="${!boo}">
						<li class="paginItem"><a
							href="<c:url value='/baSkip/thumPic.do?currentPageNumber=${page}&colour=${colourType}&queryValue=${queryValue}'/>">
								${page} </a></li>
					</c:if>
				</c:forEach>
				<li class="paginItem"><c:if test="${currentPage!=pageCount}">
						<a
							href="<c:url value='/baSkip/thumPic.do?currentPageNumber=${currentPage+1}&colour=${colourType}&queryValue=${queryValue}'/>">
							<span class="pagenxt"></span>
						</a>
					</c:if></li>
				<li class="paginItem"><a
					href="<c:url value='/baSkip/thumPic.do?currentPageNumber=${pageCount}&colour=${colourType}&queryValue=${queryValue}'/>">尾页</a>
				</li>
			</ul>
		</div>
	</div>
	<script type="text/javascript">
	$('.tablelist tbody tr:odd').addClass('odd');
	</script>
</body>
</html>
